import 'package:flutter/material.dart';
import 'package:flutter_food_ordering_web/routers/fluro_navigator.dart';
import 'package:flutter_food_ordering_web/routers/routers.dart';
import 'package:flutter_food_ordering_web/widget/load_image.dart';
import 'package:flutter_food_ordering_web/widget/my_button.dart';
import 'package:flutter_food_ordering_web/widget/text_field.dart';

class LoginPage extends StatefulWidget {
  LoginPage({Key key}) : super(key: key);

  @override
  _LoginPageState createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  //定义一个controller
  TextEditingController _nameController = TextEditingController();
  TextEditingController _passwordController = TextEditingController();
  final FocusNode _nodeText1 = FocusNode();
  final FocusNode _nodeText2 = FocusNode();
  bool _isClick = false;

  @override
  void initState() {
    super.initState();
    //监听输入改变  
    _nameController.addListener(_verify);
    _passwordController.addListener(_verify);
    // _nameController.text = FlutterStars.SpUtil.getString(Constant.phone);
  }

  @override
  void dispose() {
    //销毁TextField监听
    _nameController.dispose();
    _passwordController.dispose();
    super.dispose();
  }

  void _verify(){
    String name = _nameController.text;
    String password = _passwordController.text;
    bool isClick = true;
    if (name.isEmpty) {
      isClick = false;
    }
    if (password.isEmpty) {
      isClick = false;
    }

    /// 状态不一样在刷新，避免重复不必要的setState
    if (isClick != _isClick){
      setState(() {
        _isClick = isClick;
      });
    }
  }
  
  void _login(){
    // FlutterStars.SpUtil.putString(Constant.phone, _nameController.text);
    NavigatorUtils.push(context, Routes.store);
    debugPrint('登入成功');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xfff7f7f7),
      body: Stack(
        children: <Widget>[
          Positioned.fill(
            child: Center(
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.white,
                  border: new Border.all(color: Color(0x2b000000), width: 0.5), // 边色与边宽度
                  // 生成俩层阴影，一层绿，一层黄， 阴影位置由offset决定,阴影模糊层度由blurRadius大小决定（大就更透明更扩散），阴影模糊大小由spreadRadius决定
                 boxShadow: [BoxShadow(color: Color(0x2b000000), offset: Offset(0, 15), blurRadius: 10.0, spreadRadius: 2.0)],
                ),
                child: SizedBox(
                  width: 720,
                  height: 420,
                  child: Row(
                    children: <Widget>[
                      Container(
                        width: 274,
                        child: Column(
                          children: <Widget>[
                            SizedBox(height: 28),
                            Text('乐歌金东大厦订餐系统 ',
                              style: TextStyle(
                                color: Color(0xff333333),
                                fontSize: 14,
                                fontWeight: FontWeight.w600
                              )
                            ),
                            SizedBox(height: 2),
                            Text('Online Restaurant Reservation ',
                              style: TextStyle(
                                color: Color(0xff666666),
                                fontSize: 10,
                                fontWeight: FontWeight.w400
                              )
                            ),
                            SizedBox(height: 94),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Text('账号：',
                                  style: TextStyle(
                                    color: Color(0xff333333),
                                    fontSize: 15,
                                  )
                                ),
                                Container(
                                  width: 158,
                                  child: MyTextField(
                                    focusNode: _nodeText1,
                                    controller: _nameController,
                                    maxLength: 11,
                                    keyboardType: TextInputType.text,
                                    hintText: "请输入账号",
                                  )
                                ),
                              ],
                            ),
                            SizedBox(height: 38),
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: <Widget>[
                                Text('密码：',
                                  style: TextStyle(
                                    color: Color(0xff333333),
                                    fontSize: 15,
                                  )
                                ),
                                Container(
                                  width: 158,
                                  child: MyTextField(
                                    focusNode: _nodeText2,
                                    isInputPwd: true,
                                    controller: _passwordController,
                                    maxLength: 16,
                                    hintText: "请输入密码",
                                )
                                ),
                              ]
                            ),
                            SizedBox(height: 38),
                            MyButton(
                              onPressed: _isClick ? _login : null,
                              text: "登录",
                            ),
                          ]
                        ),
                      ),
                      SizedBox(width: 14),
                      Expanded(
                          child: LoadAssetImage('login/login_bg_center',
                          width: 446,
                        )
                      )
                    ],
                  )
                ),
              )
            )
          ),
          Positioned(
            left: 0,
            top: 0,
            child: LoadAssetImage('login/login_bg_left_top',
              width: 154,
              height: 132,
            )
          ),
          Positioned(
            right: 0,
            top: 0,
            child: LoadAssetImage('login/login_bg_right_top',
              width: 114,
              height: 108,
            )
          ),
          Positioned(
            left: 64,
            bottom: 118,
            child: LoadAssetImage('login/login_bg_left_bottom',
              width: 90,
              height: 104,
            )
          ),
          Positioned(
            right: 82,
            top: 162,
            child: LoadAssetImage('login/login_bg_right_center',
              width: 90,
              height: 300,
            )
          ),
          Positioned(
            right: 174,
            bottom: 28,
            child: LoadAssetImage('login/login_bg_right_bottom',
            width: 104,
            height: 104,
            )
          )
        ],
      ),
    );
  }
}